<template>
  <a-card :title="title">
    <div slot="extra" class="drawer-bootom-button">
      <a-dropdown :trigger="['click']" placement="topCenter">
        <a-menu slot="overlay">
          <a-menu-item key="5" @click="expandAll">展开所有</a-menu-item>
          <a-menu-item key="6" @click="closeAll">合并所有</a-menu-item>
        </a-menu>
        <a-button>
          树操作
          <a-icon type="up" />
        </a-button>
      </a-dropdown>
    </div>
    <div style="background: #fff;">
      <a-col :md="10" :sm="24">
        <template>
          <a-tree
            :show-line="true"
            :checkable="true"
            @check="onCheck"
            :checkedKeys="checkedKeys"
            :treeData="treeData"
            :expandedKeys="iExpandedKeys"
            :autoExpandParent="autoExpandParent"
            @expand="onExpand">
            <a-icon slot="switcherIcon" type="down" />
          </a-tree>
        </template>
      </a-col>
    </div>
  </a-card>
</template>

<script>
import { getAction } from '@/api/manage'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'

export default {
  name: 'ModelTree',
  props: ['title'],
  mixins: [JeecgListMixin],
  components: {},
  data() {
    return {
      iExpandedKeys: [],
      loading: false,
      autoExpandParent: true,
      treeData: [],
      hiding: true,
      checkedKeys: [],
      checkModelIds: [], // 需要筛选的模型节点id
      currSelected: {},
      allTreeKeys: [],
      url: '/sjmx2/modelTemplateConfig/treeModelList',
      orgCategoryDisabled: false
    }
  },
  created() {
  },
  computed: {},
  methods: {
    loadData() {
      this.refresh()
    },

    loadTree() {
      const that = this
      that.treeData = []
      getAction(this.url).then((res) => {
        if (res.success) {
          this.allTreeKeys = []
          let resData = res.result
          that.formatData(resData)
          for (let i = 0; i < resData.length; i++) {
            let temp = resData[i]
            that.treeData.push(temp)
            that.setThisSelectKeys(temp)
            that.getAllKeys(temp)
          }

          this.loading = false
          this.$emit('treeInit', this.checkModelIds)
        }
      })
    },

    formatData(node) {
      node.map((item) => {
        item.key = item.id
        if (item.children && item.children.length > 0) {
          this.formatData(item.children)
        }
      })
    },

    setThisExpandedKeys(node) {
      if (node.children && node.children.length > 0) {
        this.iExpandedKeys.push(node.key)
        for (let a = 0; a < node.children.length; a++) {
          this.setThisExpandedKeys(node.children[a])
        }
      }
    },

    // 默认选择
    setThisSelectKeys(node) {
      if (node.type == '5') {
        this.checkedKeys.push(node.key)
        this.checkModelIds.push(node.id)
      }
      if (node.children && node.children.length > 0) {
        for (let a = 0; a < node.children.length; a++) {
          this.setThisSelectKeys(node.children[a])
        }
      }
    },

    refresh() {
      this.loading = true
      this.loadTree()
    },

    onExpand(expandedKeys) {
      console.log('onExpand', expandedKeys)
      this.iExpandedKeys = expandedKeys
      this.autoExpandParent = false
    },

    onCheck(checkedKeys, info) {
      console.info('🚀 ~ line:137 -----', checkedKeys, info)

      this.hiding = false
      this.checkedKeys = checkedKeys

      this.checkModelIds = []
      info.checkedNodes.forEach(item => {
        if (item.data.props.type && item.data.props.type == '5') {
          this.checkModelIds.push(item.data.props.id)
        }
      })
      this.$emit('checked', this.checkModelIds)
    },

    getCurrSelectedTitle() {
      return !this.currSelected.title ? '' : this.currSelected.title
    },

    onClearSelected() {
      this.hiding = true
      this.checkedKeys = []
      this.currSelected = {}
      this.$refs.departAuth.departId = ''
    },

    expandAll() {
      this.iExpandedKeys = this.allTreeKeys
    },

    closeAll() {
      this.iExpandedKeys = []
    },

    getAllKeys(node) {
      this.allTreeKeys.push(node.key)
      if (node.children && node.children.length > 0) {
        for (let a = 0; a < node.children.length; a++) {
          this.getAllKeys(node.children[a])
        }
      }
    }
  }
}
</script>

<style lang="less" scoped>
.ant-card {
  height: 100%;
  margin: 0 3px !important;

  /deep/ .ant-card-head {
    padding: 0 15px;

    /deep/ .ant-card-head-title, /deep/ .ant-card-extra {
      padding: 10px 0;
    }
  }

  /deep/ .ant-card-body {
    padding: 10px;
    height: calc(100% - 65px);
    overflow: auto;
  }
}
</style>